<!doctype html>
<html lang="zh-cn" xmlns:th="http://www.w3.org/1999/xhtml">
<head th:replace="_fragments :: head(~{::title})">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link href="../static/css/bootstrap.min.css" rel="stylesheet">
    <title>INSTAR-人工智能实验箱</title>
    <link rel="stylesheet" href="../static/css/index.css">
    <link rel="shortcut icon" href="../static/favicon.ico" type="image/x-icon">
</head>
<link rel="stylesheet" href="../static/css/firstpage.css" th:href="@{/css/firstpage.css}">
<link rel="stylesheet" href="../static/css/header.css" th:href="@{/css/header.css}">
<body>


<!--------------------头部-begin------------------------------>
<header id="lk_header" th:replace="_fragments :: header(1)">
    <!--上部分-->
    <div class="top-bar d-none d-sm-none d-md-none d-lg-block text-center text-muted">
        <div class="container">
            <div class="row">
                <div class="top-bar-1 col-md-2">
                    <a href="" class="text-muted">
                        <i class="icon-phone"></i>
                        <span>关注微信号</span>
                        <img src="../static/images/ewm_lk.jpg" th:src="@{/images/ewm_lk.jpg}" alt="" style="width: 120px;">
                    </a>
                </div>
                <div class="top-bar-2 col-md-5">
                    <i class="icon-tel"></i>
                    <span>188-8888-8888（服务时间：9:00-21:00）</span>
                </div>
                <div class="top-bar-3 col-md-2">
                    <a href="#" class="text-muted">公司合作</a>
                </div>
                <div class="top-bar-4 col-md-3">
                    <a class="btn btn-lk btn-sm" href="/register" th:href="@{/register}">免费注册</a>
                    <a href="/login" class="ml-2 text-muted" th:href="@{/login}">立即登录</a>
                </div>
            </div>
        </div>
    </div>
    <!--下部分-->
    <nav class="navbar navbar-expand-lg navbar-light navbar-lk bg-light">
        <div class="container">
            <a class="navbar-brand d-flex justify-content-center align-items-center" href="#">
<!--               <h2 class="mt-2 text-primary"><strong>INSTAR</strong></h2>-->
                <img src="../static/images/title.png" th:src="@{/images/title.png}" alt="">
            </a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#lk_nav"
                    aria-controls="lk_nav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="lk_nav">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active">
                        <a class="nav-link" href="#">产品中心<span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" >视频教程</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" >资料下载</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" >开源社区</a>
                    </li>

                </ul>
<!--                <form class="form-inline pl-3 pr-3">-->
<!--                    <div class="input-group">-->
<!--                        <div class="input-group-prepend">-->
<!--                            <span class="input-group-text" id="basic-addon1">帖子</span>-->
<!--                        </div>-->
<!--                        <input type="text" class="form-control" placeholder="请输入你要搜索的帖子" aria-label="search" aria-describedby="basic-addon1">-->
<!--                    </div>-->
<!--                    <button class="btn btn-outline-primary my-2 my-sm-0" type="submit">Search</button>-->
<!--                </form>-->
            </div>
        </div>
    </nav>
</header>
<!--------------------头部-end------------------------------>

<!--------------------轮播图-begin------------------------------>
<section class="carousel slide">
    <div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
            <li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
            <li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
            <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
            <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner">
            <div class="carousel-item active" data-interval="4000">
                <a href="">
                    <img src="../static/images/1.jpg" th:src="@{/images/1.jpg}" class="d-block w-100" alt="...">
                </a>

<!--                <div class="carousel-caption d-none d-md-block">-->
<!--                    <h5>First slide label</h5>-->
<!--                    <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>-->
<!--                </div>-->
            </div>
            <div class="carousel-item" data-interval="4000">
                <a href="">
                    <img src="../static/images/2.jpg" th:src="@{/images/2.jpg}" class="d-block w-100" alt="...">
                </a>

<!--                <div class="carousel-caption d-none d-md-block">-->
<!--                    <h5>Second slide label</h5>-->
<!--                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>-->
<!--                </div>-->
            </div>
            <div class="carousel-item" data-interval="4000">
                <a>
                    <img src="../static/images/3.jpg" th:src="@{/images/3.jpg}" class="d-block w-100" alt="...">
                </a>

<!--                <div class="carousel-caption d-none d-md-block">-->
<!--                    <h5>Third slide label</h5>-->
<!--                    <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>-->
<!--                </div>-->
            </div>
            <div class="carousel-item" data-interval="4000">
                <a href="">
                    <img src="../static/images/4.jpg" th:src="@{/images/4.jpg}" class="d-block w-100" alt="...">
                </a>
            </div>
        </div>
        <a class="carousel-control-prev" href="#carouselExampleCaptions" role="button" data-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#carouselExampleCaptions" role="button" data-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>
</section>
<!--------------------轮播图-end------------------------------>

<div  id="robotbg">
<!--------------------公司资讯和热门课程-begin------------------------------>
<section id="lk_hot">
    <div class="container mt-4">
        <div class="row">
            <!-------公司资讯-------->
            <div class="col-sm-12 col-md-7" id="news">
                <!--标题-->
                <div>

                    <svg class="bi bi-file-post text-warning" width="1.4em" height="1.4em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                        <path fill-rule="evenodd" d="M4 1h8a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2zm0 1a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H4z"/>
                        <path d="M4 5.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-7z"/>
                        <path fill-rule="evenodd" d="M4 3.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/>
                    </svg>
                <span  class="h4" style="background-image: url('/images/highlight.png')">
                    &nbsp;公司资讯&nbsp;
                </span>
                </div>
                <!--内容-->
                <div class="panel panel-default pt-3 pl-2 pr-5">

                    <div class="panel-body">
                        <div class="row">
                            <div class="m-3 ml-1">
                                <ul class="demo1">
                                    <li class="news-item" th:each="essay:${news}" ><span th:text="${essay.description}">春节前夕看望慰问基层干部群众，是习近平总书记每年的一项重要活动。牵挂殷殷，情意深深。</span><a href="#" th:href="@{/news/{id}(id=${essay.id})}">Read more...</a></li>
                                    <!--/*-->
                                    <li class="news-item">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in venenatis enim... <a href="#">Read more...</a></li>
                                    <li class="news-item">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in venenatis enim... <a href="#">Read more...</a></li>
                                    <li class="news-item">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in venenatis enim... <a href="#">Read more...</a></li>
                                    <li class="news-item">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in venenatis enim... <a href="#">Read more...</a></li>
                                    <li class="news-item">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in venenatis enim... <a href="#">Read more...</a></li>
                                    <!--*/-->
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="panel-footer float-right">

                    </div>

                </div>
            </div>
            <!-------热门课程-------->
            <div class="col-sm-12 col-md-5">
                <!--标题-->
                <div>

                    <svg class="bi bi-brightness-high text-warning" width="1.4em" height="1.4em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                        <path fill-rule="evenodd" d="M8 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"/>
                    </svg>
                    <span  class="h4" style="background-image: url('/images/highlight.png')">
                    &nbsp;热门课程&nbsp;
                </span>
                </div>
                <!--内容-->
                <table class="table table-borderless table-hover mt-4">
                    <tbody>
                    <tr>
                        <td style="width: 18%">
                            <img data-src="../static/images/course12.png" th:src="@{/images/course12.png}" alt="" class="media-object rounded-circle img-fluid img-thumbnail">
                        </td>
                        <td>
                            <span class="text-success">【新】</span>
                            Python 基础实训
                            <p class="text-muted pt-2">
                                针对所有层次的Python学者手册
                            </p>
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 18%">
                            <img data-src="../static/images/course22.png" th:src="@{/images/course22.png}" alt="" class="media-object rounded-circle img-fluid img-thumbnail">
                        </td>
                        <td>
                            <span class="text-danger">【热】</span>
                            机器学习理论与实战
                            <p class="text-muted pt-2">
                                10大模型全程驱动教学
                            </p>
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 18%">
                            <img data-src="../static/images/course3.png" th:src="@{/images/course3.png}" alt="" class="media-object rounded-circle img-fluid img-thumbnail">
                        </td>
                        <td>
                            <span class="text-warning">【战】</span>
                            深度学习理论与实战
                            <p class="text-muted pt-2">
                                全面介绍深度学习各类神经网络
                            </p>
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 18%">
                            <img data-src="../static/images/course4.png" th:src="@{/images/course4.png}" alt="" class="media-object rounded-circle img-fluid img-thumbnail">
                        </td>
                        <td>
                            <span class="text-warning">【战】</span>
                            AI嵌入式应用实战
                            <p class="text-muted pt-2">
                                AI应用开发就业实战第一篇
                            </p>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>


        </div>

    </div>

</section>
<!--------------------新闻动态和热门课程-end------------------------------>

<!--&lt;!&ndash;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;核心团队-begin&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&ndash;&gt;-->
<!--<section id="lk_team">-->
<!--    &lt;!&ndash;标题&ndash;&gt;-->
<!--    <div class="text-center pt-5 mb-3">-->
<!--        <h2><strong>核心团队</strong></h2>-->
<!--        <img src="../static/images/divider.jpg" th:src="@{/images/divider.jpg}" alt="">-->
<!--    </div>-->
<!--    &lt;!&ndash;内容&ndash;&gt;-->
<!--    <div class="container mb-4">-->
<!--        <div class="row">-->
<!--            <div class="col-6 col-md-6 col-lg-3 d-flex">-->
<!--                <div class="card">-->
<!--                    <img class="card-img-top" src="../static/images/js1.jpg" th:src="@{/images/js1.jpg}" alt="" style="width:100%">-->
<!--                    <div class="card-body">-->
<!--                        <div class="card-title">-->
<!--                            <strong class="h5">叶锋</strong>-->
<!--                            <span style="float: right">博士,总经理</span>-->
<!--                        </div>-->
<!--                        <div class="card-text">-->
<!--                            <small>-->
<!--                                北京邮电大学通信与信息系统专业博士、福建星网锐捷博士后，福建师范大学嵌入式系统教研室主任，数字福建大数据安全技术研究所副所长，美国加州大学戴维斯分校访问副教授（2017-2018）。-->
<!--                            </small>-->
<!--                            <p>研究方向：计算机视觉、视频图像处理</p>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="col-6 col-md-6 col-lg-3 d-flex">-->
<!--                <div class="card">-->
<!--                    <img class="card-img-top" src="../static/images/js2.jpg" th:src="@{/images/js2.jpg}" alt="Card image" style="width:100%">-->
<!--                    <div class="card-body">-->
<!--                        <div class="card-title">-->
<!--                            <strong class="h5">黄添强-->
<!--                            </strong>-->
<!--                            <span style="float: right">董事长</span>-->
<!--                        </div>-->
<!--                        <p class="card-text">-->
<!--                            <small>-->
<!--                                南京航空航天大学计算机应用专业博士，数字福建大数据安全技术研究所 所长，福建省公共服务大数据挖掘与应用工程技术研究中心主任，福建省信息协会副会长兼法人，英国阿尔斯特大学访问教授（2019-2020）。-->
<!--                            </small>-->
<!--                            <br>研究方向：媒体信息安全、视频篡改检测-->

<!--                        </p>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="col-6 col-md-6 col-lg-3 d-flex">-->
<!--                <div class="card">-->
<!--                    <img class="card-img-top"  src="../static/images/js3.png" th:src="@{/images/js3.png}" alt="Card image" style="width:100%">-->
<!--                    <div class="card-body">-->
<!--                        <div class="card-title">-->
<!--                            <strong class="h5">翁彬</strong>-->
<!--                            <span style="float: right">技术总监</span>-->
<!--                        </div>-->
<!--                        <p class="card-text">-->
<!--                            <small>-->
<!--                                新加坡南洋理工大学计算机科学技术专业博士，在计算机视觉、人工智能领域发表论文十多篇，承担新加坡教育部、福建省自然科学基金等多个项目。负责与福建省气象局的天气指数预报算法研发。-->

<!--                            </small>-->
<!--                            <br>研究方向：深度学习、媒体信息安全-->

<!--                        </p>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="col-6 col-md-6 col-lg-3 d-flex">-->
<!--                <div class="card">-->
<!--                    <img class="card-img-top"  src="../static/images/js4.jpg" th:src="@{/images/js4.jpg}" alt="Card image" style="width:100%">-->
<!--                    <div class="card-body">-->
<!--                        <div class="card-title">-->
<!--                            <strong class="h5">林新棋</strong>-->
<!--                            <span style="float: right">监事</span>-->
<!--                        </div>-->
<!--                        <p class="card-text">-->
<!--                            <small>-->
<!--                                北京邮电大学博士，在计算机视觉、人工智能领域发表论文十多篇。具有福建省自然科学基金、国家自然科学基金等多个项目经验。-->
<!--                            </small>-->
<!--                            <br>研究方向：视频图像情感分析、视频篡改检测、机器学习-->


<!--                        </p>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--</section>-->
<!--&lt;!&ndash;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;核心团队-end&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&ndash;&gt;-->
</div>
<!--------------------产品中心-begin------------------------------>
<section id="lk_product" >
    <div class="container">
        <!--头部-->
        <div style="overflow: auto;" >
            <ul class="nav nav-tabs" id="myTab" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" data-toggle="tab" href="#box" role="tab" aria-controls="box"
                       aria-selected="true">智能实验箱</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#profile" role="tab" aria-controls="profile"
                       aria-selected="false">课程体系</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#profession" role="tab" aria-controls="profession"
                       aria-selected="false">专业技术</a>
                </li>


            </ul>
        </div>
        <!--内容-->
        <div class="tab-content" id="myTabContent" >
            <div class="tab-pane fade show active" id="box" role="tabpanel" aria-labelledby="box-tab" >
                <div class="container">
                    <div class="row">
                        <div class="col-md-4 d-none d-sm-none d-md-none d-lg-block box_img">
                           <img data-src="../static/images/box1.png" th:src="@{images/box1.png}" alt="">
                           <img data-src="../static/images/box.png" th:src="@{images/box.png}" alt="">
                        </div>
                        <div class="col-md-8 pd-left">
                            <h1 class="mt-5">
                                <strong class="text-danger">
                                    软硬件支撑·实时交互·全面系统
                                </strong>
                            </h1>
                            <h3>
                                导航式教学
                                <span class="text-warning">手把手带你递进学习</span>
                            </h3>
                            <ul class="text-muted live" style="margin: 15px 0;">
                                <li>Python实战篇 </li>
                                <li>深度学习实战篇：视觉、语音和文本</li>
                                <li>机器学习篇：涵盖经典机器学习算法</li>
                                <li>人工智能竞赛：机器人和机器臂</li>
                                <li>深度学习篇：经典深度学习算法</li>
                                <li>实训项目</li>
                            </ul>
                            <!--第四部分-->
                            <div>
                                <button class="btn btn-primary btn-lg" type="submit" style="margin-right: 10px;">查看详情
                                </button>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
                <div class="container">
                    <div class="row">

                        <div class="col-md-5">
                            <h1 class="text-warning mt-5">一站式解决方案</h1>
                            <p class="lead">
                                全面的人工智能知识学习体系,Instar 人工智能教学实验平台注重“人工智能基础能力”+“人工智能专业能力”培养，构建综合实验体系，提供人工智能专业教学一站式解决方案
                            </p>
                        </div>
                        <div class="col-md-7">
                            <img data-src="../static/images/coursesystem.png" th:src="@{/images/coursesystem.png}" alt="" class="img-fluid">
                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-pane fade" id="profession" role="tabpanel" aria-labelledby="profession-tab">
                <div class="container">
                    <div class="row">
                        <div class="col-md-6">
                            <!--第一部分-->
                            <div id="pd_one_1" class="mb-4 mt-4">
                                <a href="#"><img data-src="../static/images/ewm_lk.jpg" th:src="@{/images/ewm_lk.jpg}" alt="二维码" width="140"></a>
                                <div class="text-muted ml-2">
                                    <div>更多内容欢迎</div>
                                    <div>关注 INSTAR</div>
                                </div>
                            </div>
                            <!--第二部分-->
                            <div id="pd_one_2" class="breadcrumb lead mb-4">
                                <strong>实时视觉内容安全过滤技术+复杂场景的OCR识别技术+视频篡改检测PaaS平台
                                </strong>
                            </div>
                            <!--第三部分-->
                            <h2 id="pd_one_3">
                                <strong>
                                    识别技术,我们是专业的!
                                    <span class="text-danger float-right">/</span>
                                    <span class="float-right">INSTAR</span>
                                    <span class="text-danger float-right">/</span>
                                </strong>
                            </h2>

                        </div>
                        <div class="col-md-6 mt-4">
                            <img class="img-fluid" data-src="../static/images/techonology.png" th:src="@{/images/techonology.png}" alt="技术展示">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!--------------------产品中心-end------------------------------>

<!--------------------关于我们-begin------------------------------>
<section id="lk_about">
    <!--标题-->
    <div class="text-center mt-5 mb-5">
        <h2><strong>关于我们</strong></h2>
        <img data-src="../static/images/star.png" th:src="@{/images/star.png}" alt="">
    </div>
    <!--内容-->
    <div class="container">
        <div class="row mb-4">
            <div class="col-lg-8 order-2 order-lg-1">
                <ul class="cbp_tmtimeline">
                    <li>
                        <div class="cbp_tmicon"><img data-src="../static/images/ball.png" th:data-src="@{/images/ball.png}" alt=""></div>
                        <div class="cbp_tmlabel">

                            <p>
                                福建乐基科技有限公司成立于2016年，是一家致力于人工智能技术软硬件开发、教育服务的高科技企业。
                            </p>
                        </div>
                    </li>
                    <li>
                        <div class="cbp_tmicon"><img data-src="../static/images/ball.png" th:data-src="@{/images/ball.png}" alt=""></div>
                        <div class="cbp_tmlabel">
                            <p>
                                公司现有博士6人，硕士12人，本科学历12人。
                            </p>
                        </div>
                    </li>
                    <li>
                        <div class="cbp_tmicon"><img data-src="../static/images/ball.png" th:data-src="@{/images/ball.png}" alt=""></div>
                        <div class="cbp_tmlabel">
                            <p>
                                在来自中科院、清华大学、南京大学、新加坡南洋理工等科研机构的专家支持下，依托福建省科研院所的科技人才和科研平台，福建乐基科技有限公司形成了以技术注入为手段、以成果转化为目标的发展战略，推出了一系列领先的人工智能技术，包括：
                            </p>
                            <img data-src="../static/images/techintroduce.png" th:data-src="@{/images/techintroduce.png}" class="img-fluid" alt="">
                        </div>
                    </li>
                    <li>
                        <div class="cbp_tmicon"><img data-src="../static/images/ball.png" th:data-src="@{/images/ball.png}" alt=""></div>
                        <div class="cbp_tmlabel">
                            <p>
                                开发并完善Python、嵌入式AI、机器学习、深度学习等极具竞争力的课程体系、教学实验产品。
                            </p>
                        </div>
                    </li>
                    <li>
                        <div class="cbp_tmicon"><img data-src="../static/images/ball.png" th:data-src="@{/images/ball.png}" alt=""></div>
                        <div class="cbp_tmlabel">
                            <p>
                                公司致力于中国高科技成果的转化和产业化，履行“科教兴国、产业报国”的使命。
                            </p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="col-lg-4 order-1 order-lg-1 mb-3  mb-lg-0">

                <div class="row">
                    <div class="col-6 col-sm-6 col-lg-12 mb-3">
                        <img data-src="../static/images/aboutpng1.png" th:src="@{/images/aboutpng1.png}" class="img-fluid" alt="">
                    </div>
                    <div class="col-6 col-sm-6  col-lg-12">
                        <img data-src="../static/images/aboutpng.png" th:src="@{/images/aboutpng.png}" class="img-fluid" alt="">
                    </div>
                </div>

            </div>
        </div>
    </div>
</section>
<!--------------------关于我们-end------------------------------>


<!--------------------尾部-begin------------------------------>

<footer id="lk_footer" th:replace="_fragments :: footer">
    <div class="container">
        <div class="row d-flex justify-content-between align-items-center">
            <div class="col-lg-8 d-none d-sm-none d-md-none d-lg-block">
                <div class="row  d-flex justify-content-center align-items-center">
                    <div class="col-lg-2">
                        <a href="">产品中心</a>
                    </div>
                    <div class="col-lg-2">
                        <a href="">视频教程</a>
                    </div>
                    <div class="col-lg-2">
                        <a href="">资料下载</a>
                    </div>
                    <div class="col-lg-2">
                        <a href="">开源社区</a>
                    </div>
                </div>
            </div>

            <div class="col-md-6 col-lg-4 d-none d-sm-none d-md-block">
                <h6>联系我们:</h6>
                <a class="contact" href="">
                    <img data-src="../static/images/weixin-h.png" th:data-src="@{/images/weixin-h.png}" width="70" alt="">
                    <img class="image img-thumbnail" src="../static/images/ewm_lk.jpg" th:src="@{/images/ewm_lk.jpg}" alt="" style="width: 120px;">
                </a>
                <a class="contact" href="">
                    <img data-src="../static/images/xinlang-h.png" th:data-src="@{/images/xinlang-h.png}" width="70" alt="">
                    <img class="image img-thumbnail" src="../static/images/ewm_lk.jpg" th:src="@{/images/ewm_lk.jpg}" alt="" style="width: 120px;">
                </a>
            </div>
        </div>
    </div>
</footer>
<!--------------------尾部-end------------------------------>

<!--/*/<th:block th:replace="_fragments :: script">/*/-->
<script src="../static/js/jquery-3.3.1.js"></script>
<script src="../static/js/popper.js"></script>
<script src="../static/js/bootstrap.js"></script>
<!--/*/</th:block>/*/-->
<script src="../static/js/index.js" th:src="@{/js/index.js}"></script>
<script src="../static/js/bootstrap.bundle.js" th:src="@{/js/bootstrap.bundle.js}"></script>
<script src="../static/js/jquery.bootstrap.newsbox.min.js" th:src="@{/js/jquery.bootstrap.newsbox.min.js}" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){

        $(".demo1").bootstrapNews({
            newsPerPage: 5,
            autoplay: true,
            pauseOnHover:true,
            direction: 'up',
            newsTickerInterval: 4000,
            onToDo: function () {
                //console.log(this);
            }
        });


    });
</script>
<script type="text/javascript">
    $(function () {
        // 解决bootstrap下拉菜单第一次点击无反应问题
        $('.dropdown-toggle').dropdown();
    });

    //图片懒加载
    var imgs = document.querySelectorAll('img');

    //用来判断bound.top<=clientHeight的函数，返回一个bool值
    function isIn(el) {
        var bound = el.getBoundingClientRect();
        var clientHeight = window.innerHeight;
        return bound.top <= clientHeight;
    }
    //检查图片是否在可视区内，如果不在，则加载
    function check() {
        Array.from(imgs).forEach(function(el){
            if(isIn(el)){
                loadImg(el);
            }
        })
    }
    function loadImg(el) {
        if(!el.src){
            el.src = el.dataset.src;
        }
    }
    window.onload = window.onscroll = function () { //onscroll()在滚动条滚动的时候触发
        check();
    };

    $(function(){
        $(".course").hover(function(){
            $(this).addClass("shadow-sm");
        },function(){
            $(this).removeClass("shadow-sm");
        })
    })
</script>
</body>
</html>